<template>
  <div>
    <el-card>
      通过文件上传单词
      <div>
        <el-upload style="display: inline-block" action="string" :limit="1" :file-list="fileList"
          :before-upload="beforeUpload" accept=".xlsx,.xls" :show-file-list="false"
          :http-request="uploadFile"><el-button type="success">导入</el-button></el-upload>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      fileList: [], // 导入的文件
    };
  },

  methods: {

    // 导入前检查文件
    beforeUpload(file) {
      // const extension = file.name.split(".")[1] === "xls";
      // const extension2 = file.name.split(".")[1] === "xlsx";
      // const isLt2M = file.size / 1024 / 1024 < 2;
      // if (!extension && !extension2) {
      //   this.$message({
      //     message: "上传模板只能是 xls、xlsx格式!",
      //     type: "error",
      //   });
      // }
      // if (!isLt2M) {
      //   console.log("上传模板大小不能超过 2MB!");
      //   this.$message({
      //     message: "上传模板大小不能超过 2MB!",
      //     type: "error",
      //   });
      // }
      // return extension || extension2 || isLt2M;
    },

    // 导入文件
    async uploadFile(param) {
      //this.$router.go(0);
      const File = param.file;
      let formDataInfo = new FormData();
      formDataInfo.append("file", File);
      // const config = {
      //   url: "/signCard/loadConferenceFile",
      //   method: "post",
      //   data: formDataInfo,
      // };
      // http为我所在项目封装了router的js代码，如果需要传递给后端，需要
      // 如上方代码我写的信息进行传递即可
      // http(config)
      //   .then((res) => {
      //     this.$message({
      //       message: res.data,
      //       type: "success",
      //     });
      //   });
      let res = await this.$API.word.addWordByFile(formDataInfo, window.localStorage.getItem('userId'));
      if (res.code == 200) {
        this.$message({
          message: res.msg,
          type: "success",
        });
      } else {
        this.$message({
          message: res.msg,
          type: "error",
        });
      }
    }
  },


}

</script>

<style>

</style>